<template>
	<jk-view :loading="showLoading">
		<el-form ref="ruleForm" :model="ruleForm" :rules="rules" :hide-required-asterisk="pageType === 'detail'" label-width="90px" :show-message="false">
			<jk-operation-card class="margin-bottom-10 margin-top-10 width-100-percent fixed-operation-bar">
				<div class="flex-between-center">
					<div class="flex-start-center">
					</div>
					<div class="flex-start-center">
						<el-button type="info" plain icon="el-icon-back" size="small" class="item-gap" @click="onJumpList">返回列表</el-button>
						<jk-button v-if="pageType !== 'detail'" icon="el-icon-finished" :loading="saveBtnLoading" type="primary" @click="onConfirmBtn">保存</jk-button>
					</div>
				</div>
			</jk-operation-card>
			<jk-card class="margin-bottom-10">
				<div ref="box1">
					<el-row ref="box1" class="flex-start-center-wrap">
						<el-col :span="8">
							<el-form-item class="margin-bottom-10" label="区域" prop="workshopId">
								<span v-if="ruleForm.id" class="read-only-2">{{ ruleForm.workshopName }}</span>
								<jk-select v-else v-model="ruleForm.workshopId" :option-list="workshopList" size="medium" class="width-100-percent" placeholder="区域" @change="onWorkshopChange"></jk-select>
							</el-form-item>
						</el-col>
						<el-col :span="8">
							<el-form-item class="margin-bottom-10" label="日期" prop="belongDate">
								<span v-if="ruleForm.id" class="read-only-2">{{ ruleForm.belongDate }}</span>
								<jk-date-picker v-else v-model="ruleForm.belongDate" type="date" size="medium" placeholder="日期" @change="onDateChange" />
							</el-form-item>
						</el-col>
						<el-col :span="8">
							<el-form-item class="margin-bottom-10" label="班次" prop="scheduleShiftId">
								<span v-if="pageType === 'detail' || dataId" class="read-only-2">{{ ruleForm.scheduleShiftName }}</span>
								<el-select v-else v-model="ruleForm.scheduleShiftId" clearable placeholder="班次" class="width-100-percent" @change="onScheduleShiftChange">
									<el-option
										v-for="item in scheduleShiftList"
										:key="item.id"
										:label="`${item.shiftName} (${item.beginTime} ~ ${item.endTime})`"
										:value="item.id"
									></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="8">
							<el-form-item class="margin-bottom-0" label="班组" prop="scheduleGroupId">
								<span v-if="pageType === 'detail' || dataId" class="read-only-2">{{ ruleForm.scheduleGroupName }}</span>
								<jk-select v-else v-model="ruleForm.scheduleGroupId" :option-list="groupList" size="medium" label-key-name="groupName" class="width-100-percent" placeholder="班组" @change="onGroupChange"></jk-select>
							</el-form-item>
						</el-col>
						<el-col :span="8">
							<el-form-item class="margin-bottom-0" label="统计员" prop="empId">
								<span v-if="pageType === 'detail'" class="read-only-2">{{ ruleForm.empName }}</span>
								<remote-search-emp-input
									v-else
									placeholder="统计员"
									only-key="empId"
									query-name="empName"
									:form-data="ruleForm"
									@on-select="onSelectEmpChange"
								></remote-search-emp-input>
							</el-form-item>
						</el-col>
						<el-col v-if="pageType !== 'detail'" :span="8">
							<el-form-item class="margin-bottom-0" label="">
								<el-button :loading="refreshLoading" :disabled="!ruleForm.workshopId || !ruleForm.belongDate || !ruleForm.scheduleShiftId || !ruleForm.scheduleGroupId" size="small" type="primary" icon="el-icon-refresh" @click="onRefreshDataBtn">更新数据</el-button>
							</el-form-item>
						</el-col>
					</el-row>
				</div>
			</jk-card>
			<jk-card v-loading="refreshLoading" class="machine-table" style="overflow: auto;">
				<div class="flex-between-center margin-bottom-4 machine-card-header">
					<el-tag class="" type="primary" effect="plain">
						<span class="el-icon-tickets item-gap"></span>
						<span>机台产量汇总</span>
					</el-tag>
					<div class="flex-end-center">
						<div class="item-gap"><el-button :disabled="!ruleForm.id" size="mini" icon="el-icon-download" @click="onExportMachineBtn"></el-button></div>
						<el-button :disabled="!ruleForm.id" size="mini" icon="el-icon-printer" class="item-gap" @click="onPrintBtn(1)"></el-button>
						<jk-full-screen-button type="default" class-name="machine-table"></jk-full-screen-button>
					</div>
				</div>
				<machine-data
					ref="machineTableCom"
					:page-type="pageType"
					:machine-data="ruleForm.machineList"
					:height="dialogTableHeight + 20"
					@on-update="onUpdateMachineData"
				></machine-data>
				<div class="flex-between-center margin-bottom-4 margin-top-10">
					<el-tag class="" type="primary" effect="plain">
						<span class="el-icon-user item-gap"></span>
						<span>人员工资汇总</span>
					</el-tag>
					<div class="flex-end-center">
						<emp-info-batch-push-wx
							:disabled="!ruleForm.id"
							:data-item="{
								...ruleForm,
								empList: ruleForm.empList,
								belongDate: ruleForm.belongDate,
								scheduleShiftName: ruleForm.scheduleShiftName,
								scheduleGroupName: ruleForm.scheduleGroupName
							}"
						></emp-info-batch-push-wx>
						<div class="item-gap"><el-button :disabled="!ruleForm.id" size="mini" icon="el-icon-download" @click="onExportEmpBtn"></el-button></div>
						<el-button :disabled="!ruleForm.id" size="mini" icon="el-icon-printer" @click="onPrintBtn(2)"></el-button>
					</div>
				</div>
				<jk-table
					ref="empTable"
					show-footer
					:stripe="false"
					:footer-method="footerMethod"
					border
					:data="ruleForm.empList"
					class="margin-bottom-10"
				>
					<vxe-column title="姓名" align="left" field="empName" :width="120">
						<template slot-scope="scope">
							<emp-info-push-wx
								:data-item="{
									...scope.row,
									...ruleForm,
									empId: scope.row.empId, // 统计员的字段和员工的字段名冲突，所以要覆盖掉统计员的
									empName: scope.row.empName
								}"
							></emp-info-push-wx>
						</template>
					</vxe-column>
					<vxe-column title="产量(M)" align="right" field="empOutputM" :width="100" />
					<vxe-column title="产量(kg)" align="right" field="empOutputKg" :width="100" />
					<vxe-column title="看台列表" align="left" field="machineList" :width="360">
						<template slot-scope="scope">
							<div>{{ scope.row.machineList ? scope.row.machineList.map(x => x.machineCode).join(' , ') : '' }}</div>
						</template>
					</vxe-column>
					<vxe-column title="补贴" align="right" field="bdAllowance" :width="100">
						<template slot-scope="scope">
							<span v-if="pageType === 'detail'">{{ scope.row.bdAllowance }}</span>
							<jk-number-input v-else v-model="scope.row.bdAllowance" :min="-99999" size="mini" @change="onBtChange($event, scope)"></jk-number-input>
						</template>
					</vxe-column>
					<vxe-column title="工资合计" align="right" field="totalSalary" :width="100">
						<template slot-scope="scope">
							<span v-if="pageType === 'detail'">{{ scope.row.totalSalary }}</span>
							<jk-number-input v-else v-model="scope.row.totalSalary" :min="-99999" size="mini" @change="updateTableFooterData"></jk-number-input>
						</template>
					</vxe-column>
				</jk-table>
				<el-form-item class="padding-bottom-10" label-width="50px" label="备注">
					<el-input v-model="ruleForm.remark" :disabled="pageType === 'detail'" :rows="2" size="large" type="textarea" placeholder="" />
				</el-form-item>
				<el-tag class="margin-bottom-4" type="primary" effect="plain">
					<span class="el-icon-postcard item-gap"></span>
					<span>岗位与人员明细</span>
				</el-tag>
				<jk-table
					:stripe="false"
					border
					:data="ruleForm.postList"
					class="margin-bottom-10"
				>
					<vxe-column title="岗位" align="left" field="postName" :width="120">
						<template slot-scope="scope">
							<div>{{ `${scope.row.postName} (${scope.row.empList.length}人)` }}</div>
						</template>
					</vxe-column>
					<vxe-column title="人员" align="left" field="machineList" :width="660">
						<template slot-scope="scope">
							<div>{{ scope.row.empList ? scope.row.empList.map(x => x.empName).join(' , ') : '' }}</div>
						</template>
					</vxe-column>
				</jk-table>
			</jk-card>
		</el-form>
	</jk-view>
</template>

<script>
    import calHeight from '/src/mixins/cal-dialog-height';
    import checkboxMachineDialog from '../../../schedule/empMachine/components/checkbox-machine-dialog';
    import remoteSearchEmpInput from '../../../production/order/components/remote-search-emp-input';
    import { formatDate, tipsBar } from '../../../../utils/jk/jk-tool';
    import { workforcemanagementScheduleList } from '../../../../api/schedule/scheduling';
    import machineData from '../components/machine-data';
    import { mathJsAdd, mathJsSub } from '../../../../utils/jk/jk-cals';
    import handlerCache from '../../../../mixins/handler-cache';
    import XEUtils from 'xe-utils';
    import {
        spinReportAfterPlanGroupYieldGet,
        reportAfterSpinningDayDataNew,
        spinReportAfterPlanGroupYieldCreate, spinReportAfterPlanGroupYieldUpdate
    } from '../../../../api/production/xsDailyGroupYieldNew';
    import empInfoPushWx from './emp-info-push-wx';
    import empInfoBatchPushWx from './emp-info-batch-push-wx';
    export default {
        components: {
            empInfoBatchPushWx,
            empInfoPushWx,
            machineData,
            checkboxMachineDialog,
            remoteSearchEmpInput
        },
        props: {
            // 页面权限的前缀
            permissionPrefix: {
                type: String,
                default: ''
            },
            dialogState: {
                type: Boolean,
                default: false
            },
            pageType: {
                type: String,
                default: ''
            }
        },
        mixins: [calHeight, handlerCache],
        data() {
            return {
                refreshLoading: false,
                dataId: null,
                activeTab: '0',
                groupList: [],
                workshopList: [],
                showDialog: false,
                showLoading: true,
                saveBtnLoading: false,
                ruleForm: {
                    id: null,
                    scheduleShiftId: null,
                    scheduleGroupId: null,
                    belongDate: '',
                    empId: null,
                    empName: '',
                    workshopId: null,
                    machineList: []
                },
                rules: {
                    belongDate: [{ required: true, trigger: 'change' }],
                    scheduleGroupId: [{ required: true, trigger: 'change' }],
                    empId: [{ required: true, trigger: 'change' }],
                    scheduleShiftId: [{ required: true, trigger: 'change' }],
                    workshopId: [{ required: true, trigger: 'change' }]
                },
                scheduleShiftList: []
            };
        },
        methods: {
            onExportMachineBtn() {
                import('@/vendor/Export2Excel').then(excel => {
                    const titleList = this.$refs.machineTableCom.$refs.machineTable.$refs.xTable.getColumns().map(x => x.title);
                    const keyList = this.$refs.machineTableCom.$refs.machineTable.$refs.xTable.getColumns().map(x => x.field);
                    const arr = this.ruleForm.machineList ? JSON.parse(JSON.stringify(this.ruleForm.machineList)) : [];
                    const dataList = arr.map(x => {
                        return x;
                    });
                    // 合计项
                    const totalItem = {};
                    dataList.push(totalItem);
                    const data = dataList.map(v => keyList.map(j => v[j]));
                    excel.export_json_to_excel({
                        header: titleList,
                        data,
                        filename: `细纱日产量机台产量表(${this.ruleForm.scheduleGroupName}${formatDate(this.ruleForm.belongDate, '')})`,
                        autoWidth: true,
                        bookType: 'xlsx'
                    });
                });
            },
            onExportEmpBtn() {
                import('@/vendor/Export2Excel').then(excel => {
                    const titleList = this.$refs.empTable.$refs.xTable.getColumns().map(x => x.title);
                    const keyList = this.$refs.empTable.$refs.xTable.getColumns().map(x => x.field);
                    const arr = this.ruleForm.empList ? JSON.parse(JSON.stringify(this.ruleForm.empList)) : [];
                    const dataList = arr.map(x => {
                        x.machineList = x.machineList ? x.machineList.map(k => k.machineName).join() : '';
                        return x;
                    });
                    // 合计项
                    const totalItem = {};
                    keyList.forEach((x, idx) => {
                        totalItem[x] = this.$refs.empTable.$refs.xTable.getTableData().footerData[0][idx];
                    });
                    dataList.push(totalItem);
                    const data = dataList.map(v => keyList.map(j => v[j]));
                    excel.export_json_to_excel({
                        header: titleList,
                        data,
                        filename: `细纱日产量人员工资表(${this.ruleForm.scheduleGroupName}${formatDate(this.ruleForm.belongDate, '')})`,
                        autoWidth: true,
                        bookType: 'xlsx'
                    });
                });
            },
            onRefreshDataBtn() {
                this.refreshLoading = true;
                this.getScheduleGroupMachineData();
            },
            footerMethod({ columns, data }) {
                return [
                    columns.map((column, columnIndex) => {
                        if (columnIndex === 0) {
                            return '合计:';
                        }
                        if (['totalSalary', 'empOutputM', 'empOutputKg', 'bdAllowance'].includes(column.property)) {
                            return XEUtils.sum(data, column.property);
                        }
                        return null;
                    })
                ];
            },
            onPrintBtn(type) {
                const routeUrl = this.$router.resolve({
                    name: 'printXsDailyGroupYieldNew',
                    query: {
                        id: this.ruleForm.id,
                        printType: type
                    }
                });
                window.open(routeUrl.href, '_blank');

                const titleList = ['工序', '机台', '车速', '上班表数', '本班表数', '产量(米)', '产量(公斤)'/*, '姓名', '产量', '产量工资'*/];
                let valueList = [];
                valueList = this.ruleForm.machineList.map(x => {
                    // row.empList
                    return [
                        x.processName,
                        x.machineName,
                        x.rotateSpeed,
                        x.startOutputM,
                        x.endOutputM,
                        x.outputM,
                        x.outputKg
                    ];
                });
            },
            onBtChange(e, scope) {
                let val = 0;
                val = mathJsAdd(val, scope.row.singleSalary || 0);
                val = mathJsAdd(val, scope.row.bdAllowance || 0);
                this.$set(this.ruleForm.empList[scope.rowIndex], 'totalSalary', val);
                this.updateTableFooterData();
            },
            updateTableFooterData() {
                this.$refs.empTable.$refs.xTable.updateFooter();
            },
            onJumpList() {
                this.$store.dispatch('tagsView/delView', { path: this.$route.path });
                this.$toMainRouter({
                    name: 'XsDailyGroupYieldNew'
                });
            },
            onUpdateMachineData(e) {
                this.ruleForm.machineList = JSON.parse(JSON.stringify(e));
                let empVal = 0;
                let val3 = 0;
                let valKg = 0;
                this.ruleForm.empList.forEach(empItem => {
                    empVal = 0;
                    val3 = 0;
                    valKg = 0;
                    this.ruleForm.machineList.forEach(machineItem => {
                        if (machineItem.empId === empItem.empId) {
                            empVal = mathJsAdd(machineItem.empMachineSalary || 0, empVal);

                            val3 = mathJsAdd(machineItem.empMachineOutputM, Number(val3));
                            valKg = mathJsAdd(machineItem.empMachineOutputKg || 0, valKg);
                        }
                    });
                    this.$set(empItem, 'singleSalary', empVal); // 不算补贴的工资
                    this.$set(empItem, 'totalSalary', mathJsAdd(empVal, empItem.bdAllowance));

                    this.$set(empItem, 'empOutputM', val3);
                    this.$set(empItem, 'empOutputKg', valKg);
                });
                this.updateTableFooterData();
            },
            onGroupChange(e) {
                this.$set(this.ruleForm, 'machineList', []);
                this.$set(this.ruleForm, 'empList', []);
                if (e) {
                    this.getScheduleGroupMachineData();
                }
            },
            getScheduleGroupMachineData() {
                if (!this.ruleForm.workshopId || !this.ruleForm.belongDate || !this.ruleForm.scheduleShiftId || !this.ruleForm.scheduleGroupId) return false;
                this.refreshLoading = true;
                reportAfterSpinningDayDataNew({
                    workshopId: this.ruleForm.workshopId,
                    belongDate: this.ruleForm.belongDate,
                    scheduleShiftId: this.ruleForm.scheduleShiftId,
                    scheduleGroupId: this.ruleForm.scheduleGroupId
                }).then(res => {
                    this.refreshLoading = false;
                    if (res.data.status === 200) {
                        this.$set(this.ruleForm, 'postList', res.data.res.postList ? res.data.res.postList.map(x => x) : []);
                        this.$set(this.ruleForm, 'machineList', res.data.res.machineList ? res.data.res.machineList.map(x => x) : []);
                        this.$set(this.ruleForm, 'empList', res.data.res.empList ? res.data.res.empList.map(x => {
                            x.bdAllowance = x.bdAllowance || 0;
                            x.singleSalary = x.singleSalary || 0;
                            x.totalSalary = x.singleSalary;
                            return x;
                        }) : []);
                    }
                });
            },
            onWorkshopChange() {
                this.$set(this.ruleForm, 'scheduleGroupId', null);
                this.$set(this.ruleForm, 'scheduleId', null);
                this.$set(this.ruleForm, 'scheduleShiftId', null);
                this.$set(this.ruleForm, 'shiftId', null);
                this.$set(this.ruleForm, 'shiftName', null);
                this.$set(this.ruleForm, 'machineList', []);
                this.$set(this.ruleForm, 'empList', []);
                this.groupList = [];
                this.scheduleShiftList = [];
                this.getDateScheduleShiftOptionRequest();
            },
            onScheduleShiftChange(e) {
                this.$set(this.ruleForm, 'machineList', []);
                this.$set(this.ruleForm, 'empList', []);
                this.groupList = [];
                let item = {};
                if (e) {
                    item = this.scheduleShiftList.find(x => x.id === e);
                } else {
                    item = {
                        id: null,
                        shiftId: null,
                        shiftName: null,
                        scheduleId: null
                    };
                }
                this.groupList = item.scheduleGroupList;
                this.$set(this.ruleForm, 'scheduleGroupId', null);
                this.$set(this.ruleForm, 'scheduleId', item.scheduleId);
                this.$set(this.ruleForm, 'scheduleShiftId', item.id);
                this.$set(this.ruleForm, 'shiftId', item.shiftId);
                this.$set(this.ruleForm, 'shiftCode', item.shiftCode);
                this.$set(this.ruleForm, 'shiftName', item.shiftName);
                this.$set(this.ruleForm, 'scheduleShiftCode', item.shiftCode);
                this.$set(this.ruleForm, 'scheduleShiftName', item.shiftName);
            },
            onDateChange() {
                this.$set(this.ruleForm, 'scheduleGroupId', null);
                this.$set(this.ruleForm, 'scheduleShiftId', null);
                this.$set(this.ruleForm, 'shiftId', null);
                this.$set(this.ruleForm, 'shiftCode', null);
                this.$set(this.ruleForm, 'shiftName', null);
                this.$set(this.ruleForm, 'scheduleShiftCode', null);
                this.$set(this.ruleForm, 'scheduleShiftName', null);
                this.$set(this.ruleForm, 'prdReportMachineList', []);
                this.$set(this.ruleForm, 'machineList', []);
                this.$set(this.ruleForm, 'empList', []);
                this.groupList = [];
                this.scheduleShiftList = [];
                this.getDateScheduleShiftOptionRequest();
            },
            getDateScheduleShiftOptionRequest() {
                if (this.ruleForm.workshopId && this.ruleForm.belongDate) {
                    return workforcemanagementScheduleList({
                        belongDate: [this.ruleForm.belongDate, this.ruleForm.belongDate],
                        workshopId: this.ruleForm.workshopId
                    }).then(res => {
                        if (res.data.status === 200) {
                            const resData = res.data.res;
                            if (resData && resData.length) {
                                this.scheduleShiftList = resData[0].scheduleShiftList;
                                if (this.ruleForm.id) {
                                    const item = this.scheduleShiftList.find(x => x.id === this.ruleForm.scheduleShiftId) || {};
                                    this.groupList = item.scheduleGroupList;
                                }
                            }
                        }
                    });
                }
            },
            onSelectBatchChange(e, rowIndex, cellIndex) {
                if (Object.keys(e).length) {
                    this.$set(this.ruleForm.subTitleList[rowIndex].productUseCommunicationItemList[cellIndex], 'batchId', e.id);
                    this.$set(this.ruleForm.subTitleList[rowIndex].productUseCommunicationItemList[cellIndex], 'batchCode', e.batchCode);
                }
            },
            onSelectProductChange(e, rowIndex, cellIndex) {
                if (Object.keys(e).length) {
                    this.$set(this.ruleForm.subTitleList[rowIndex].productUseCommunicationItemList[cellIndex], 'productId', e.id);
                    this.$set(this.ruleForm.subTitleList[rowIndex].productUseCommunicationItemList[cellIndex], 'productCode', e.code);
                    this.$set(this.ruleForm.subTitleList[rowIndex].productUseCommunicationItemList[cellIndex], 'productName', e.name);
                    this.$set(this.ruleForm.subTitleList[rowIndex].productUseCommunicationItemList[cellIndex], 'productModels', e.models);
                }
            },
            onSelectEmpChange(e) {
                if (Object.keys(e).length) {
                    this.$set(this.ruleForm, 'empId', e.id);
                    this.$set(this.ruleForm, 'empName', e.name);
                }
            },
            onAddMachineBtn({ rowIndex }) {
                this.ruleForm.subTitleList[rowIndex].productUseCommunicationItemList.push({
                    'batchCode': '',
                    'batchId': 0,
                    'color': '',
                    'dosage': '',
                    'extendText': '',
                    'productCode': '',
                    'productId': 0,
                    'productModels': '',
                    'productName': '',
                    'remark': '',
                    'subTitle': ''
                });
            },
            onAddBtn() {
                this.ruleForm.subTitleList.push({
                    subTitle: null,
                    productUseCommunicationItemList: []
                });
            },
            getParamData() {
                const params = JSON.parse(JSON.stringify(this.ruleForm));
                const item = this.workshopList.find(x => x.id === params.workshopId) || {};
                params.workshopCode = item.code;
                params.workshopName = item.name;

                if (!this.dataId) {
                    const scheduleGroupItem = this.groupList.find(x => x.id === params.scheduleGroupId) || {};
                    params.groupId = scheduleGroupItem.groupId;
                    params.scheduleGroupCode = scheduleGroupItem.groupCode;
                    params.scheduleGroupName = scheduleGroupItem.groupName;
                }
                return params;
            },
            createAndUpdateRequest() {
                this.saveBtnLoading = true;
                // 新增
                if (!this.dataId) {
                    this.ruleForm.id = null;
                    spinReportAfterPlanGroupYieldCreate(this.getParamData()).then(res => {
                        this.saveBtnLoading = false;
                        if (res.data.status === 200) {
                            this.$tipsBar(this, 'save');
                            this.$store.dispatch('tagsView/delView', { path: this.$route.path });
                            this.$toOtherRouter({
                                name: 'editXsDailyGroupYieldNew',
                                query: {
                                    id: res.data.res
                                }
                            });
                        }
                    });
                    return;
                }

                // 编辑
                spinReportAfterPlanGroupYieldUpdate(this.getParamData()).then(res => {
                    this.saveBtnLoading = false;
                    if (res.data.status === 200) {
                        this.$tipsBar(this, 'save');
                        this.getDependentData();
                    }
                });
            },
            onConfirmBtn(type) {
                this.$refs['ruleForm'].validate(valid => {
                    if (valid) {
                        this.createAndUpdateRequest();
                    } else {
                        this.$tipsBar(this, 'validator');
                    }
                });
            },
            onVisibleChange(e) {
                this.$emit('on-visible-change', e);
                if (!e) {
                    Object.assign(this.$data, this.$options.data());
                    this.$nextTick(() => {
                        this.$refs.ruleForm.resetFields();
                    });
                }
            },
            getDetailRequest() {
                return spinReportAfterPlanGroupYieldGet({ id: this.dataId }).then(res => {
                    if (res.data.status === 200) {
                        this.ruleForm = res.data.res;
                        this.ruleForm.empList = this.ruleForm.empList.map(x => {
                            x.singleSalary = mathJsSub(x.totalSalary, x.bdAllowance);
                            return x;
                        });
                    }
                });
            },
            async getDependentData() {
                this.showLoading = true;
                this.dataId = this.$route.query.id;
                this.workshopList = this.$store.state.user.userWorkshop.workshopList;
                if (!this.dataId) {
                    this.$set(this.ruleForm, 'belongDate', formatDate(Date.now()));
                    this.$set(this.ruleForm, 'empId', this.$store.state.user.empInfo.id);
                    this.$set(this.ruleForm, 'empName', this.$store.state.user.empInfo.name);
                    this.$set(this.ruleForm, 'workshopId', this.$store.state.user.userWorkshop.defaultWorkshopId);
                }
                if (this.dataId) await this.getDetailRequest();
                if (!this.dataId) await this.getDateScheduleShiftOptionRequest();
                this.showLoading = false;
            },
            clearCacheMethod() {
                Object.assign(this.$data, this.$options.data());
                this.$nextTick(() => {
                    this.$refs.ruleForm.clearValidate();
                    this.getDependentData();
                });
            }
        },
        mounted() {
            this.getScheduleGroupMachineData();
            this.getDependentData();
        }
    };
</script>
<style scoped lang="scss">
    .machine-card-header {
        position: sticky;
        top: 0;
        left: 0;
        z-index: 20;
        background: #fff;
        padding: 4px 0;
        border-bottom: solid 1px #eee;
        margin-top: -4px;
    }
</style>
